{% load static djng_tags sekizai_tags tutorial_tags %}
<!doctype html>
<html lang="en" ng-app="djangular-demo">
<head>
	<title>{% block form_title %}Django-Angular Demo{% endblock %}</title>
	<meta name="viewport" content="width=device-width, initial-scale=1.0" />
	{% render_block "css" %}
	<!-- Global Site Tag (gtag.js) - Google Analytics -->
	<script async src="https://www.googletagmanager.com/gtag/js?id=UA-107291474-1"></script>
	<script>
		window.dataLayer = window.dataLayer || [];
		function gtag(){dataLayer.push(arguments)};
		gtag('js', new Date());
		gtag('config', 'UA-107291474-1');
	</script>
</head>

{% addtoblock "css" %}<link href="{% static 'node_modules/bootstrap/dist/css/bootstrap.css' %}" rel="stylesheet" />{% endaddtoblock %}
{% addtoblock "css" %}<link href="{% static 'djng/css/styles.css' %}" rel="stylesheet" />{% endaddtoblock %}
{% addtoblock "css" %}<link href="{% static 'djng/css/bootstrap3.css' %}" rel="stylesheet" />{% endaddtoblock %}
{% addtoblock "css" %}<link href="{% static 'css/djangular-demo.css' %}" rel="stylesheet" />{% endaddtoblock %}

{% addtoblock "js" %}<script src="{% static 'node_modules/angular/angular.js' %}" type="text/javascript"></script>{% endaddtoblock %}

<body>
	<header class="navbar navbar-static-top navbar-inverse">
		<div class="container">
			<div class="row">
				<div class="col-xs-12">
					<h1 class="navbar-brand">django-angular<small style="margin-left: 3em;">Let Django play well with AngularJS</small></h1>
				</div>
			</div>
		</div>
	</header>

	<div class="container">
		<div class="row">
			<nav class="col-md-3" style="margin-top: 65px;" role="navigation">
				<ul class="nav nav-pills nav-stacked">
					<li class="{% active request 'djng_classic_subscription' %}">
						<a href="{% url 'djng_classic_subscription' %}">Classic Subscription</a>
					</li>
					<li class="{% active request 'djng_form_validation' %}">
						<a href="{% url 'djng_form_validation' %}">Client Side Validation</a>
					</li>
					<li class="{% active request 'djng_model_scope' %}">
						<a href="{% url 'djng_model_scope' %}">Server Side Validation</a>
					</li>
					<li class="{% active request 'djng_combined_validation' %}">
						<a href="{% url 'djng_combined_validation' %}">Combined Validation</a>
					</li>
					<li class="{% active request 'djng_image_file' %}">
						<a href="{% url 'djng_image_file' %}">Image and File Upload</a>
					</li>
					<li class="{% active request 'djng_form_sets' %}">
						<a href="{% url 'djng_form_sets' %}">Form Sets <span class="badge pull-right">New</span></a>
					</li>
					{% if WITH_WS4REDIS %}
					<li class="{% active request 'djng_3way_databinding' %}">
						<a href="{% url 'djng_3way_databinding' %}">Three-Way Data-Binding</a>
					</li>
					{% endif %}
				</ul>
			</nav>
			<main class="col-md-9">
			{% block main-content %}{% endblock %}
			</main>
		</div>
	</div>

	{% render_block "js" %}

	<script type="text/javascript">
	angular.module('djangular-demo', [{% with_data "ng-requires" as ng_requires %}
		{% for module in ng_requires %}'{{ module }}'{% if not forloop.last %}, {% endif %}{% endfor %}{% end_with_data %}])
	{% with_data "ng-config" as configs %}
		{% for config in configs %}.config({{ config }}){% endfor %};
	{% end_with_data %}
	</script>

	{% block addtoblock %}
	<script src="{% static 'js/djng-tutorial.js' %}" type="text/javascript"></script>
	{% endblock %}

	<a href="https://github.com/jrief/django-angular">
		<img style="position: absolute; top: 0; right: 0; border: 0; z-index: 1001;" src="https://camo.githubusercontent.com/365986a132ccd6a44c23a9169022c0b5c890c387/68747470733a2f2f73332e616d617a6f6e6177732e636f6d2f6769746875622f726962626f6e732f666f726b6d655f72696768745f7265645f6161303030302e706e67" alt="Fork me on GitHub" data-canonical-src="https://s3.amazonaws.com/github/ribbons/forkme_right_red_aa0000.png">
	</a>
</body>
</html>
